page {
  background-color: var(--colorGray);
  margin-top: 15rpx;
  
  .img-wrap {
    width: 100%;
    height: 410rpx;
    background-color: #ddd;
    position: relative;
  }

  .img-desc {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 150rpx;
    transform: translateX(-50%);

    .add {
      width: 100rpx;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      // border: 1rpx solid #999;
      border-radius: 50%;
      .up {
        display: flex;
        .left{
          width: 50rpx;
          height: 50rpx;
          border-right: 1rpx solid #999;
          border-bottom: 1rpx solid #999;
        }
        .right {
          width: 49rpx;
          height: 50rpx;
          border-bottom: 1rpx solid #999;
        }
      }
      .down {
        display: flex;
        .left{
          width: 50rpx;
          height: 49rpx;
          border-right: 1rpx solid #999;
        }
        .right {
          width: 49rpx;
          height: 49rpx;
        }
      }
    }
    .text {
      // height: 82rpx;
      padding-top: 50rpx;
      font-size: 36rpx;
      // background-color: #02A7F0;
      // color: #fff;
      // font-weight: bold;
      // text-align: center;
      // line-height: 82rpx;
    }
  }

  .item-wrap {
    position: relative;
    height: 90rpx;
    color: #797979;
    font-size: 36rpx;
    background-color: #fff;
    .name {
      position: absolute;
      left: 56rpx;
      top: 40rpx;
    }
    input {
      width: 490rpx;
      height: 50rpx;
      border: 1px solid #aaa;
      position: absolute;
      left: 222rpx;
      top: 40rpx;
      padding-left: 10rpx;
    }
    &.last {
      padding-bottom: 130rpx;
      margin-bottom: 15rpx;
    }
  }

  .bottom-wrap {
    background-color: #fff;
    padding: 40rpx;
    margin-bottom: 135rpx;

    .desc {
      width: 670rpx;
      min-height: 150rpx;
      margin-bottom: 30rpx;
      color: #333;
      border: 1px solid #ccc;
    }
    
    .img {
      width: 334rpx;
      height: 334rpx;
      float: left;
      position: relative;
    }
    .img image {
      width: 334rpx;
      height: 334rpx;
      border: 1px solid #ccc;
    }
    .img .img-close {
      width: 60rpx;
      height: 60rpx;
      background-color: #0006;
      text-align: center;
      line-height: 58rpx;
      color: #fff;
      font-size: 50rpx;
      position: absolute;
      top: 1rpx;
      right: 1rpx;
    }
    .img.add {
      width: 334rpx;
      height: 334rpx;
      border: 1px solid #ccc;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      .top {
        display: flex;
        .left {
          width: 100rpx;
          height: 100rpx;
          border-right: 1rpx solid #ccc;
          border-bottom: 1rpx solid #ccc;
        }
        .right{
          width: 100rpx;
          height: 100rpx;
          border-bottom: 1rpx solid #ccc;
        }
      }
      .bottom {
        display: flex;
        .left {
          width: 100rpx;
          height: 100rpx;
          border-right: 1rpx solid #ccc;
        }
        .right{
          width: 100rpx;
          height: 100rpx;
        }
      }
    }
  }

  .bottom-btn{
    width: 100%;
    height: 120rpx;
    position: fixed;
    left: 0;
    bottom: 0;
    background-color: #02A7F0;
    color: #fff;
    font-size: 36rpx;
    text-align: center;
    line-height: 120rpx;
  }
}